{% extends "index.html" %}
{% block head %}
	<meta name="description" contents="tags" />
	<link rel="canonical" href="{{ SITEURL }}/tags.html" />
  <title>{{ SITENAME }}:Tags</title>
{% endblock %}
{% block content %}
    <a href="/posts/2014-05-18-tag-cloud-network-visualization.html" title="制作说明" ><i class="fa fa-magic"></i></a><i>双击标签查看</i>
    <canvas id="tagsnet" width="800" height="600" style="border:1px solid rgba(0, 0, 0, 0.2);margin:20px auto">
      Opps, it seems that you should update your browser ^_^
    </canvas>
    <script src="/theme/js/jquery.min.js" type="text/javascript"></script>
    <script src="/theme/js/springy.js" type="text/javascript"></script>
    <script src="/theme/js/springyui.js" type="text/javascript"></script>
  <script type="text/javascript">
      Network = {
            "nodes":[
              {% for node in tags_network.nodes %}
              {'name': '{{node.Name}}', 'count': {{node.Value}}, 'index': {{node.ID}}, 'url': '{{node.Url}}'}{% if not loop.last %},{% endif %}
              {% endfor %}
              ],
            "links":[
              {% for link in tags_network.links %}
              {'source': {{link.Src}}, 'target': {{link.Tar}}, 'value': {{link.Value}}}{% if not loop.last %},{% endif %}
              {% endfor %}
              ]
      }
      var graph = new Springy.Graph();
      graph.addNodes(Network['nodes']);
      graph.addEdges(Network['links']);
      jQuery(function(){
        var springy = window.springy = jQuery('#tagsnet').springy({
            graph: graph
        });
      });

  </script>
{% endblock %}
